<template>
  <div class="project-item" @click="goToDetails">
    <Row justify="space-between" align="middle">
      <p class="name">{{ info.projectName }}</p>
      <BtnPlain type="primary">{{ info.lastNewFeedbackPhaseName }}</BtnPlain>
    </Row>
    <div class="stage-com">
      <StageCom :projectStage="info.projectStage" />
    </div>
    <Row>
      <Col span="12">
        <span class="label">信息类型:</span>
        <span>{{ info.infoTypeName }}</span>
      </Col>
      <Col span="12">
        <span class="label">省份:</span>
        <span>{{ info.province }}</span>
      </Col>
      <Col span="12">
        <span class="label">城市:</span>
        <span>{{ info.city }}</span>
      </Col>
      <Col span="12">
        <span class="label">项目地址:</span>
        <span>{{ info.projectAddressName }}</span>
      </Col>
    </Row>
  </div>
</template>

<script>
import StageCom from '../../businessInformationManage/common/stageCom.vue'

export default {
  name: 'ProjectItem',
  components: { StageCom },
  props: {
    info: {
      type: Object,
      default: () => { }
    },
    tabValue: {
      type: String,
      default: 'project'
    },
  },
  data () {
    return {

    }
  },
  methods: {
    goToDetails () {
      const { busInfoTrackId } = this.info
      this.$router.push({ path: '/businessInfoTrackDetails', query: { busInfoTrackId } })
    }
  }
}
</script>

<style lang='less' scoped>
.project-item {
  cursor: pointer;
  .stage-com {
    margin: 10px 0 20px;
  }

  .name {
    font-size: 20px;
    font-weight: 500;
  }

  .label {
    margin-right: 15px;
    color: #7b8591;
  }
}
</style>
